<template>
    <div>
        <a-card title="数据列表">
        <template #extra>
            <a-button type="primary" @click="handleExport">导出为excel</a-button>
        </template>
        <a-table :columns="columns" :data="ener.energyData" :bordered="{ cell: true }" :pagination="false">
            <template #contrast="{ record }">
                <a-button @click="$modal.info({ content:record.name })">view</a-button>
            </template>
            </a-table>
            <a-pagination 
                    :total="total" 
                    show-page-size 
                    :page-size=4
                    :page-size-options="[4,8,12,16,20]"
                     @change="Change"/>
        </a-card>
        
    </div>
</template>

<script setup lang="ts">
import { excelExport2 } from '../../utils/excel-sdk';
import { reactive } from 'vue';
import {enerGet,enGet,textGet} from "../../api/energy/energy";
import {useEnergy} from "../../store/energy";
let ener=useEnergy()
    const columns = reactive([
    {
        title: '水厂',
        dataIndex: 'works',
        width: 70,
    },
    {
        title: '设备类型',
        dataIndex: 'type',
        width: 70,
    },
    {
        title: '设备名称',
        dataIndex: 'typeName',
        width: 70,

    },
    {
        title: '日期',
        dataIndex: 'date',
        width: 70,
    },
    {
        title: '供水量(m³)',
        dataIndex: 'supply',
        width: 70,
    },
    {
        title: '电流(A)',
        dataIndex: 'elect',
        width: 70,
    },
    {
        title: '电压(KV)',
        dataIndex: 'voltage',
        width: 70,
    },
    {
        title: '功率(KW)',
        dataIndex: 'power',
        width: 70,
    },
    {
        title: '功率因数',
        dataIndex: 'factor',
        width: 70,
    },
    {
        title: '电量',
        dataIndex: 'quantity',
        width: 70,
    },
    {
        title: '供水/电量对比',
        slotName: 'contrast',
        width: 70,
    },
]);
let total=0;
//获取数据库数据
textGet().then((res) => {
    let {results,count}=res.data
    ener.energyData = results;
    total=count;
})
function handleExport(){
    excelExport2(ener.energyData,{
        objectId:"数据ID"
        ,works:"水厂"
        ,typeName:"设备名称"
    },"制水能耗数据")
}
function Change(page:number){
    textGet(page).then((res)=>{
        console.log(res,page);
        let {results}=res.data;
        ener.energyData=results
    })
}
</script>

<style scoped>

</style>